<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jquery源码解析视频72-1</title>
    <script src="../jquery-2.0.3.js"></script>
</head>

<body>
    <div class="box">div1<span>span</span></div>
    <div>div2</div>

    <script>
        $(function () {
            // 一、实例demo
            // filter()、not() 两个是相反的操作、都是过滤的方法
            // $("div").css("border", "1px solid red");

            // 1、使用filter()方法
            // $("div").filter(".box").css("border", "1px solid red");

            // 2、使用not()方法
            // $("div").not(".box").css("border", "1px solid red");

            // 3、使用has()方法，对在当前内部元素起作用/当前元素的子项上有没有满足条件元素
            // $("div").has(".box").css("border", "1px solid red"); // 边框颜色未变红
            $("div").has("span").css("border", "1px solid red"); // 边框颜色变红

            /** 总结
             * 
             * filter()、not()在元素自身上进行筛选
             * has()当前元素的子项上有没有满足条件元素
             * 
            **/


            // 二、源码分析
            // if ( typeof qualifier === "string" ) {
            //     if ( isSimple.test( qualifier ) ) {
            //         return jQuery.filter( qualifier, elements, not );
            //     }

            //     qualifier = jQuery.filter( qualifier, elements );
            // }
            // var isSimple = /^.[^:#\[\.,]*$/
            // 匹配成功: .box、div、#div1、:odd、ul li
            // 匹配不成功: div.odd、ul #li、ul[title="hello"]、div.box、ul,ol
        });
    </script>

</body>

</html>